<style>
    .detail_form {
        height: calc(100% - 68px);
        overflow: auto;
        padding-top: 15px;
    }

    .detail_form .layui-form-item {
        margin-left: 0px;
        margin-right: 30px;
    }

    .detail_form_footer {
        position: absolute;
        bottom: 0;
        text-align: right;
        box-sizing: border-box;
        width: 100%;
        padding: 7px 13px;
        border-top: 1px solid #eee;
        background-color: #FCFCFC;
    }
</style>
<form class="layui-form detail_form" action="" lay-filter="system-user-edit-form">
    <input type="hidden" name="user_id" value="#(detail.user_id)">
    <div class="layui-form-item">
        <label class="layui-form-label">姓名</label>
        <div class="layui-input-block">
            <input type="text" name="user_name" value="#(detail.user_name)" lay-verify="required" placeholder="请输入姓名" class="layui-input" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">帐号</label>
        <div class="layui-input-block">
            <input type="text" name="user_account" value="#(detail.user_account)" lay-verify="required" placeholder="请输入帐号" class="layui-input" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input type="password" name="password" placeholder="若不修改请留空" class="layui-input" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机</label>
        <div class="layui-input-block">
            <input type="text" name="user_phone" value="#(detail.user_phone)" lay-verify="required" placeholder="请输入手机" class="layui-input" autocomplete="off">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">状态</label>
        <div class="layui-input-block">
            <input type="radio" name="user_status" value="1" title="启用" #(detail.user_status== 1?'checked':'')>
            <input type="radio" name="user_status" value="0" title="禁用" #(detail.user_status== 0?'checked':'')>
        </div>
    </div>
    <div class="detail_form_footer">
        <a class="layui-btn" lay-submit lay-filter="btn-system-user-submit">保存</a>
        <a class="layui-btn layui-btn-primary" lay-filter="btn-system-user-cancle">取消</a>
    </div>
</form>

<script>
    layui.use(['admin', 'form', 'laydate'], function () {
        var $ = layui.$
            , admin = layui.admin
            , element = layui.element
            , layer = layui.layer
            , laydate = layui.laydate
            , table = layui.table
            , form = layui.form;

        form.render(null, 'system-user-edit-form');


        /* 自定义验证规则 */
        form.verify({
            title: function (value) {
                if (value.length < 5) {
                    return '标题至少得5个字符啊';
                }
            }
            , pass: [/(.+){6,12}$/, '密码必须6到12位']
            , content: function (value) {
                layedit.sync(editIndex);
            }
        });

        /* 监听提交 */
        form.on('submit(btn-system-user-submit)', function (data) {
            layer.msg('正在保存中，请稍候', {icon: 16});
            $.ajax({
                method: 'post',
                url: "/system/user/save",
                data: data.field,
                dataType: 'json',
                success: function (rs) {
                    if (rs.success) {
                        layer.msg(rs.message || '保存成功', {icon: 6});
                        let config = #(detail.user_id == null ? '{page: {curr: 1}}' : '{}');
                        table.reload('system-user-table', config);
                        layer.closeAll('page'); //关闭所有页面层
                    } else {
                        layer.msg('保存失败,' + rs.message || '保存失败', {icon: 5});
                    }
                },
                error: function (a, b, c) {
                    layer.msg('请求异常，保存失败', {icon: 5});
                }
            });
            return false;
        });
        /* 监听取消 */
        $("[lay-filter=btn-system-user-cancle]").click(function () {
            layer.closeAll("page");
        });
    });
</script>